<template>


	<view>
		<u-tabbar :value="index" @change="tabBarChange" @click="tabBarChange2" :safeAreaInsetBottom="true" activeColor="#1057FC">
			<u-tabbar-item :text="list[0].text">
				<template #active-icon>
					<image class="u-page__item__slot-icon" :src="list[0].selectedIconPath"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon" :src="list[0].iconPath"></image>
				</template>
			</u-tabbar-item>

			<u-tabbar-item :text="list[1].text">
				<template #active-icon>
					<image class="u-page__item__slot-icon" :src="list[1].selectedIconPath"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon" :src="list[1].iconPath"></image>
				</template>
			</u-tabbar-item>

			<u-tabbar-item :text="list[2].text">
				<template #active-icon>
					<image class="u-page__item__slot-icon" :src="list[2].selectedIconPath"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon" :src="list[2].iconPath"></image>
				</template>
			</u-tabbar-item>

			<u-tabbar-item text="">
			</u-tabbar-item>
			<u-tabbar-item text="">
			</u-tabbar-item>
			<u-tabbar-item text="">

			</u-tabbar-item>
		</u-tabbar>
		<view style="display: flex; justify-content: center; align-items: center;
				position: absolute;  right: 10rpx; height: 100rpx; bottom: 0rpx; width: 280rpx; z-index: 999;">
			<view style="background-color: #1057FC;color: #fff; 
			width: 260rpx; padding: 15rpx;
			font-size: 30rpx;
			border-radius: 10rpx; 
			text-align: center;">+关注</view>
		</view>
		<view>
			<u-popup :overlayOpacity="0.6" :round="10" mode="center" :show="show" @close="close" @open="open">
				<view class="issue-item">
					<u-grid :border="false" col="3">
						<u-grid-item v-for="(listItem,listIndex) in pjlist" :key="listIndex" @click="gopage(listIndex)">					 
							<u-icon :name="listItem.iconPath" :size="40"></u-icon>
							<text class="grid-text">{{listItem.text}}</text>
						</u-grid-item>
					</u-grid>
				</view>
			 

			</u-popup>
		</view>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				show: false,
				list: [{
						"pagePath": "/pages/company/pjsys",
						"iconPath": this.$imgurl + "/company/xypj.png",
						"selectedIconPath": this.$imgurl + "/company/xypj.png",
						"text": "主页"
					},
					{
						"pagePath": "/pages/company/pjsys",
						"iconPath": this.$imgurl + "/company/fxpj.png",
						"selectedIconPath": this.$imgurl + "/company/fxpj.png",
						"text": "评级"
					},
					{
						"pagePath": "/pages/company/pjsys",
						"iconPath": this.$imgurl + "/company/cwpj.png",
						"selectedIconPath": this.$imgurl + "/company/cwpj.png",
						"text": "监控"
					}, {}, {}, {}
				],
				pjlist: [{
						"pagePath": "/pages/company/pjsys",
						"iconPath": this.$imgurl + "/company/xypj.png",
						"text": '信用评级'
					},
					{
						"pagePath": "/pages/company/pjsys",
						"iconPath": this.$imgurl + "/company/fxpj.png",
						"text": '风险评级'
					},
					{
						"pagePath": "/pages/company/pjsys",
						"iconPath": this.$imgurl + "/company/cwpj.png",
						"text": '财务评级'
					},
					{
						"pagePath": "/pages/company/pjsys",
						"iconPath": this.$imgurl + "/company/lypj.png",
						"text": '履约评级'
					},
					{
						"pagePath": "/pages/company/pjsys",
						"iconPath": this.$imgurl + "/company/jppj.png",
						"text": '竞品评级'
					},
					{
						"pagePath": "/pages/company/pjsys",
						"iconPath": this.$imgurl + "/company/kcpj.png",
						"text": '科创评级'
					},

				]
			}
		},
		computed: {
			index() {
				return this.$store.state.qyzytabidx
			}

		},
		methods: {
			tabBarChange2(){
				this.show = true;
			},
			tabBarChange(e) {
				this.$u.vuex("qyzytabidx", e)
				this.show = true;
			
				console.log('eeeeeeeeeeeeeee', e)
			},
			gopage(e){
				const that = this;
				uni.navigateTo({
					url:that.pjlist[e].pagePath,
				})
			},
			//点击发布按钮的弹出层
			open() {
				console.log('open');
			},
			close() {
				this.show = false;
				console.log('close');
			},
			//点击我要卖
			toQuery() {
				console.log("点击了");
				uni.reLaunch({
					url: '/pages/company/company_search'
				})
			},
			toPhjr() {
				console.log("点击了");
				uni.reLaunch({
					url: '/pages/phjr/phjr'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
 
	.u-page__item__slot-icon {
		width: 50rpx;
		height: 50rpx;
	}

	.u-page__item__slot-icon-big {
		width: 90rpx;
		height: 90rpx;
		margin-bottom: 50rpx;
	}

	.issue-item {			 
		height: 400rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		// padding: 10rpx 10rpx;		
	}
	.grid-text{
		font-size:  28rpx;
	}
</style>